import React from 'react';
import { Menu, Icon, Button } from 'antd';

const SubMenu = Menu.SubMenu;

class HeaderMenu extends React.Component {
    state = {
      current: 'mail',
    }
  
    handleClick = (e) => {
      console.log('click ', e);
      this.setState({
        current: e.key,
      });
    }
  
    render() {
      return (
        <Menu
          onClick={this.handleClick}
          mode="horizontal"
          style={{float: 'right'}}
        >
          <Menu.Item key="search">
            <Icon type="search" />
          </Menu.Item>
          <Menu.Item key="mail">
            <Icon type="question-circle" />
          </Menu.Item>
          <Menu.Item key="app">
            <Icon type="bell" />
          </Menu.Item>
          <SubMenu title={<span className="submenu-title-wrapper">
              <img src="https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png" style={{weight:'30px', height:'30px'}}/>
                admin</span>}>
              <Menu.Item key="setting:1">Option 1</Menu.Item>
              <Menu.Item key="setting:2">Option 2</Menu.Item>
          </SubMenu>
          <Menu.Item key="alipay">
            <Button>中文</Button>
          </Menu.Item>
        </Menu>
      );
    }
}

export default HeaderMenu;
